<template>
  <div>
    <div style="width: 100%;height: 100px;">
      <a-form formLayout="horizontal" :label-col="{ span: 5 }" :wrapper-col="{ span: 18 }">
        <a-row :gutter="[16, 8]">
          <!--          <a-col :span="4">-->
          <!--            <a-button-group >-->
          <!--              <a-button @click="whole()">-->
          <!--                全部-->
          <!--              </a-button>-->
          <!--              <a-button @click="classA()">-->
          <!--                甲班-->
          <!--              </a-button>-->
          <!--              <a-button @click="classB()">-->
          <!--                乙班-->
          <!--              </a-button>-->
          <!--              <a-button @click="classC()">-->
          <!--                丙班-->
          <!--              </a-button>-->
		  
          <!--            </a-button-group>-->
          <!--          </a-col>-->
          <a-col :span="4">
            <a-space>
              <a-button icon="left" @click.stop="goPrev" />
              <a-date-picker
                v-model:value="currentMonth"
                placeholder="选择日期"
                :allowClear="false"
                @change="onChangeDate"
              />
              <a-button icon="right" @click.stop="goNext" />
            </a-space>
          </a-col>
          <a-col :span="4">
            <a-form-model-item label="姓名" prop="realname">
              <a-input v-model="queryParam.realname" placeholder="请输入姓名" />
            </a-form-model-item>
          </a-col>
          <a-col :span="4">
            <!--            <a-form-model-item label="公司" prop="company">-->
            <!--              <j-dict-select-tag-->
            <!--                dictCode="crm_company,name,id"-->
            <!--                v-model="queryParam.company"-->
            <!--                placeholder="请选择组织"-->
            <!--              >-->
            <!--              </j-dict-select-tag>-->
            <!--            </a-form-model-item>-->
            <a-form-model-item label="工号" prop="workNo">
              <a-input v-model="queryParam.workNo" placeholder="请输入工号" />
            </a-form-model-item>
          </a-col>
          <a-col :span="4">
            <a-form-model-item label="车间" prop="workshop">
              <j-multi-select-tag placeholder="请选择车间" v-model="queryParam.workshop" dictCode="workshop" />
            </a-form-model-item>
          </a-col>
          <a-col :span="4">
            <a-form-model-item label="班次" prop="shift">
              <j-dict-select-tag placeholder="请选择班次" v-model="queryParam.classes" dictCode="shift" />
            </a-form-model-item>
          </a-col>
		  <a-col :span="4">
		  	<a-form-model-item label="工序" prop="classes">
		  		<j-dict-select-tag placeholder="请选择工序" v-model="queryParam.working_procedure" dictCode="working_procedure" />
		  	</a-form-model-item>
		  </a-col>
          <a-col :span="4">
            <a-form-model-item label="品种" prop="productType">
              <j-dict-select-tag
                placeholder="请选择"
                v-model="queryParam.productType"
                dictCode="crm_product_type_spooling,product_type,id"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form>
      <a-row :gutter="16">
        <a-col :span="24">
          <a-space style="float: right">
            <a-button @click="handleExportXls('普工')" type="default" icon="export">导出报表</a-button>
            <a-button @click="handleSearch()" type="primary">
              搜索
            </a-button>
            <a-button @click="handleAdd" type="primary">新增</a-button>
            <a-button @click="generateSalary()" type="primary">
              生成报表
            </a-button>
            <!-- <a-button>导出长度报表</a-button> -->
            <!-- <a-button>导出报表</a-button> -->
          </a-space>
        </a-col>
      </a-row>
    </div>
    <div style="margin-top: 30px;">
      <a-table :columns="columns" rowKey="id" :data-source="dataSource" :scroll="{ x: 2000 }" :pagination="ipagination" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
               @change="handleTableChange">
        <!-- 操作 -->
        <a-space slot="action" slot-scope="text, record">
          <template>
            <a-button style="padding: 0px" type="link" icon="edit" @click="handleEdit(record)">编辑</a-button>
            <a-popconfirm title="确认要删除吗?" @confirm="() => handleDelete(record.id)">
              <a-button style="color: red; padding: 0px" type="link" icon="delete">删除</a-button>
            </a-popconfirm>
          </template>
        </a-space>
      </a-table>
    </div>

    <dang-che-gong-modal ref="modalForm" @ok="modalFormOk" :planTime="queryParam.planTime"></dang-che-gong-modal>
  </div>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import DangCheGongModal from './modules/DangCheGongModal'
import moment from 'moment'
import { getGenerateSalarySpooling } from '../../../api/customApi'
const path = '/crm_salary_excel_spooling/crmSalaryExcelSpooling'
export default {
  mixins: [JeecgListMixin],
  components: { DangCheGongModal },
  data() {
    return {
      currentMonth: moment(),
      columns,
      data,
      queryParam: {
        planTime: moment().format('YYYY-MM-DD')
      },
      url: {
        list: path + '/list',
        delete: path + '/delete',
        deleteBatch: path + '/deleteBatch',
        exportXlsUrl: '/crm_salary_excel_spooling/crmSalaryExcelSpooling/exportExcel'
      }
    }
  },
  methods: {
    goPrev() {
      var newMonth = moment(this.currentMonth).subtract(1, 'day')
      this.currentMonth = newMonth
      this.queryParam.planTime = this.currentMonth.format('YYYY-MM-DD')
      this.searchQuery()
    },
    goNext() {
      var newMonth = moment(this.currentMonth).add(1, 'day')
      this.currentMonth = newMonth
      this.queryParam.planTime = this.currentMonth.format('YYYY-MM-DD')
      this.searchQuery()
    },
    onChangeDate(date, dateString) {
      this.queryParam.planTime = dateString
      this.searchQuery()
    },
    changeObject() {},
    refresh() {
      this.searchQuery()
    },
    handleSearch() {
      this.searchQuery()
      this.visible = false
    },
    handleCancel() {
      this.visible = false
    },
    handleReset() {
      this.searchReset()
    },
    add() {
      this.visable1 = true
    },
    detail(record) {},
    onChangePage(e) {
      this.ipagination.current = e
      this.loadData()
    },
    generateSalary() {
      let query = {
        planTime: this.queryParam.planTime
      }
      getGenerateSalarySpooling(query).then(res => {
        if (res.success) {
          this.$message.success('生成成功')
          this.searchQuery()
        }
      })
    },
    btnImport() {},
    btnExport() {}
  }
}

const columns = [
  // { title: '车间', width: 100, dataIndex: 'column1', key: 'column1', fixed: 'left' },
  // { title: '班次', width: 100, dataIndex: 'column2', key: 'column2', fixed: 'left' },
  // { title: '上班时间', width: 100, dataIndex: 'column3', key: 'column3', fixed: 'left'},
  // { title: '细纱车间', width: 100, dataIndex: 'column4', key: 'column4', fixed: 'left'},
  // { title: '络简车间', width: 100,dataIndex: 'column5', key: 'column5', fixed: 'left'},
  // { title: '工号', dataIndex: 'column6', key: 'column6', width: 150 },
  // { title: '姓名', dataIndex: 'column7', key: 'column7', width: 150 },
  // { title: '工种', dataIndex: 'column8', key: 'column8', width: 150 },
  // { title: '类型', dataIndex: 'column9', key: 'column9', width: 150 },
  // { title: '品种', dataIndex: 'column10', key: 'column10', width: 150 },
  // { title: '起始台位', dataIndex: 'column11', key: 'column11', width: 150 },
  // { title: '终止台位', dataIndex: 'column12', key: 'column12',width: 150  },
  // { title: '实开台数', dataIndex: 'column13', key: 'column13', width: 150 },
  // { title: '8小时台数', dataIndex: 'column14', key: 'column14', width: 150 },
  // { title: '单价', dataIndex: 'column15', key: 'column15', width: 150 },
  // { title: '工资', dataIndex: 'column16', key: 'column16', width: 150 },
  // { title: '其他补贴', dataIndex: 'column17', key: 'column17', width: 150 },
  // { title: '工资合计', dataIndex: 'column18', key: 'column18', width: 150 },
  // { title: '备注', dataIndex: 'column19', key: 'column19',width: 150  },
  { title: '日期', width: 150, dataIndex: 'planTime', key: 'planTime', fixed: 'left' },
  { title: '细纱车间', width: 150, dataIndex: 'workshop', key: 'workshop', fixed: 'left' },
  { title: '络筒车间', width: 150, dataIndex: 'workshopSpooling', key: 'workshopSpooling', fixed: 'left' },
  { title: '班次', width: 150, dataIndex: 'shift_dictText', key: 'shift', fixed: 'left' },
  { title: '时间', width: 150, dataIndex: 'workHours', key: 'workHours', fixed: 'left' },
  { title: '工号', width: 150, dataIndex: 'workNo', key: 'workNo', fixed: 'left' },
  { title: '姓名', width: 150, dataIndex: 'realname', key: 'realname', fixed: 'left' },
  { title: '工序', width: 150, dataIndex: 'workType', key: 'workType' },
  { title: '类型', width: 150, dataIndex: 'productCategory', key: 'productCategory' },
  { title: '品种', width: 150, dataIndex: 'productType_dictText', key: 'productType' },
  { title: '台位起', width: 150, dataIndex: 'pedestalStart', key: 'pedestalStart' },
  { title: '台位终', width: 150, dataIndex: 'pedestalEnd', key: 'pedestalEnd' },
  { title: '8小时台数', width: 150, dataIndex: 'machinesNumEightHours', key: 'machinesNumEightHours' },
  { title: '数量', width: 150, dataIndex: 'machinesNum', key: 'machinesNum' },
  { title: '单价', width: 150, dataIndex: 'unitPrice', key: 'unitPrice' },
  { title: '工资', width: 150, dataIndex: 'wages', key: 'wages' },
  { title: '其它补贴', width: 150, dataIndex: 'otherSubsidies', key: 'otherSubsidies' },
  { title: '合计工资', width: 150, dataIndex: 'totalWages', key: 'totalWages' },
  { title: '备注', width: 150, dataIndex: 'remark', key: 'remark' }
]
const data = [
  {
    column1: 1,
    column2: 1,
    column3: 1,
    column4: 1,
    column5: 1,
    column6: 1,
    column7: 1,
    column8: 1,
    column9: 1,
    column10: 1,
    column11: 1,
    column12: 1,
    column13: 1,
    column14: 1,
    column15: 1,
    column16: 1,
    column17: 1,
    column18: 1,
    column19: 1
  }
]
</script>

<style scoped></style>
